<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <link rel="icon" type="image/x-icon" th:href="${application.iconPath}" />
    <title>代码预览</title>
    <div th:include="../templates/aaacommon/basic::html_header"></div>
    <style type="text/css">
        #dir, #content {
            border: 2px solid #ccc;
            margin-left: 10px;
            margin-top: 10px;
            /* background: rgba(255, 255, 255, 0.3);
                    box-shadow: 0 0 10px #000; */
        }

        #dir {
            width: 20%;
            height: auto;
            float: left;
            padding-bottom: 20px;
            margin-bottom: 20px;
            overflow-x: auto;
        }

        #content {
            width: 77%;
            height: auto;
            float: left;
        }

        body .layui-tree-skin-shihuang .layui-tree-branch {
            color: #EDCA50;
        }
    </style>
</head>
<body>
<div id="dir">
    <ul id="demo"></ul>
</div>
<div id="content">
    <pre id="code" lay-encode="true" class="layui-code"></pre>
</div>
<input type="hidden" id="common_basePath" th:value="${application.basePath }"/>
</body>
<script type="text/javascript" th:inline="javascript">
    layui.use(['element', 'form', 'layer', 'tree', 'code'], function () {
        var element = layui.element;
        var form = layui.form;
        var layer = layui.layer;
        var basePath = $("#common_basePath").val();

        $.post(basePath + "/db/getnode.do", {
            flg: false
        }, function (jsonarr) {
            layui.tree({
                elem: '#demo',
                nodes: jsonarr,
                skin: 'shihuang',
                click: function (node) {
                    var path = node.filepath;
                    $.ajax({
                        cache: false,
                        type: 'post',
                        url: basePath + '/db/getfilecontent.do',
                        data: {path: path},
                        async: false,
                        error: function (request) {
                        },
                        success: function (list) {
                            $("#code").html('');
                            //<p>&lt;&gt;</p>
                            for (var i = 0; i < list.length; i++) {
                                // 全局替换
                                var all = list[i].replace(new RegExp("&", 'gm'), "&amp;").replace(new RegExp("<", 'gm'), "&lt;").replace(new RegExp(">", 'gm'), "&gt;");
                                //								var all = list[i];
                                //                                console.log(all);
                                $("#code").append('&nbsp;' + all + "<br/>");
                            }
                            /* layui.code({
                             elem: '#code',
                             title: 'JavaScript'
                             }); */
                        }
                    });
                }
            });
        });

    });
</script>
</html>